<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
  // 属性
  props: {
    msg: {
      type: String,
      required: true,
    }
  },

  // data() 返回的属性将会成为响应式的状态, 并且暴露在 `this` 上
  data() {
    return {
      count: 0
    }
  },

  methods: {
    increment() {
      this.count++
    }
  },

  mounted() {
    console.log('option组件挂载完数字是', this.count, this.$route)
  }
})
</script>
  
  <template>
  <h3>children: {{ msg || 'OptionApi' }}</h3>
  <div>
    <button type="button" @click="increment">计数器 {{ count }}</button>
  </div>
</template>
  
<style scoped>
</style>
  